<!-- BEGIN PAGE HEADER-->
<h3 class="page-title">
    用户管理
</h3>
<div class="container-fluid" ng-show="!userGrid.edit">
    <div class="col-md-4 portlet">
        <div class="portlet-title">
            <div class="caption">
                部门
            </div>
        </div>
        <div class="portlet-body">
            <div ed-dept-tree ed-click="selectDept" style="height:450px; overflow:auto;"></div>
            <!--<div class="ztree" style="height:450px; overflow:auto;" id="deptTree"></div>-->
        </div>
    </div>
    <div class="col-md-8">
        <div class="portlet-title">
            <div class="caption" style="width:50%;display:inline;height:34px;line-height:34px">
                用户列表
                <button class="btn btn-success" style="display:inline" ng-click="userGrid.add()"><i class="fa fa-plus"></i> 新增
                </button>
            </div>
            <form class="form-inline" role="form" id="queryForm" style="float:right;margin-top:0">
                <div class="form-group">
                    <div class="input-group">
                        <span class="input-group-addon" id="basic-addon1"><i
                                class="glyphicon glyphicon-search"></i></span>
                        <input type="text" class="form-control" placeholder="用户编码或姓名" aria-describedby="basic-addon1"
                               ng-model="userGrid.query.codeOrName">
                    </div>
                </div>
                <button class="btn btn-primary" ng-click="userGrid.query()"><i class="fa fa-search"></i> 查询</button>
            </form>
        </div>
        <div class="portlet-body">
            <table ed-grid="userGrid" class="table table-striped table-bordered table-advance table-hover"
                   ed-url="user/query.do" ed-model="user">
                <thead>
                <tr>
                    <th ed-data="_index"></th>
                    <th ed-data="userCode">用户名</th>
                    <th ed-data="userName">用户姓名</th>
                    <th ed-data="gender | code : 'gender'">性别</th>
                    <th ed-data="telephone">手机号码</th>
                    <th ed-data="userState | code : 'userstate'">状态</th>
                    <th width="200px">操作</th>
                </tr>
                </thead>
            </table>
        </div>
    </div>
</div>
<!-- END PAGE HEADER-->
<!-- BEGIN MAIN CONTENT -->

<div class="portlet light bordered edit" ng-show="userGrid.edit">
    <div class="portlet-title">
        <div class="caption">
            <i class="icon-equalizer font-red-sunglo"></i>
            <span class="caption-subject font-red-sunglo bold uppercase">用户编辑</span>
        </div>
        <div class="actions">
            <a class="btn btn-circle btn-icon-only btn-default" href="javascript:;" ng-click="userGrid.cancel();">
                <i class="icon-action-undo"></i>
            </a>
        </div>
    </div>
    <div class="portlet-body form">
        <!-- BEGIN FORM-->
        <form action="#" class="form-horizontal w5c-form" w5c-form-validate novalidate name="validateForm">
            <div class="form-body">
                <div class="form-group">
                    <label class="col-md-3 control-label">用户编号</label>

                    <div class="col-md-4">
                        <input type="text" class="form-control" name="userCode" ng-model="user.userCode" required>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-md-3 control-label">用户姓名</label>

                    <div class="col-md-4">
                        <input type="text" class="form-control" name="userName" ng-model="user.userName"
                               required ed-validate="name" ng-maxlength="10">
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-md-3 control-label">性别</label>

                    <div class="col-md-4">
                        <select class="form-control" name="gender" ng-model="user.gender"
                                ng-options="opt.value as opt.name for opt in options.gender" required></select>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-md-3 control-label">手机号码</label>

                    <div class="col-md-4">
                        <input type="text" class="form-control" ng-model="user.telephone">
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-md-3 control-label">所属部门</label>

                    <div class="col-md-4">
                        <div ed-combotree name="deptId"
                             data-options="idField: 'deptId', textField: 'deptName', parentIdField: 'parentDeptId'"
                             ng-model="user.deptId" ed-data="depts" placeholder="请选择所属部门" required></div>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-md-3 control-label">类型</label>

                    <div class="col-md-4">
                        <select class="form-control" name="userType" ng-model="user.userType"
                                ng-options="opt.value as opt.name for opt in options.usertype" required></select>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-md-3 control-label">状态</label>

                    <div class="col-md-4">
                        <select class="form-control" name="userState" ng-model="user.userState"
                                ng-options="opt.value as opt.name for opt in options.userstate" required></select>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-md-3 control-label">用户描述</label>

                    <div class="col-md-4">
                        <textarea class="form-control" rows="3" ng-model="user.remark"></textarea>
                    </div>
                </div>
            </div>
            <div class="form-actions">
                <div class="row">
                    <div class="col-md-offset-3 col-md-4">
                        <button type="button" class="btn green" w5c-form-submit="userGrid.save()"><i
                                class="fa fa-save"></i> 保存
                        </button>
                        <button type="button" class="btn default" ng-click="userGrid.cancel();validateForm.reset();"><i
                                class="fa fa-times"></i> 取消
                        </button>
                    </div>
                </div>
            </div>
        </form>
        <!-- END FORM-->
    </div>
</div>

<div ed-tips="userInfo">
    <!-- 用户信息显示 -->
    <div id="userInfo" style="padding:7px 0px 7px 0" ng-show="!userRoleEdit">
        <div style="float:left;font-size:28px;height:40px;line-height:40px;margin-right:18px;">{{user.userName}}</div>
        <div style="float:left;color:#999">
            <div class="one-line" style="max-width:240px;">用户名：{{user.userCode}}</div>
            <div>手机号：{{user.telephone}}</div>
            <div>部门：{{user.deptName}}</div>
        </div>
        <div style="padding:6px 0px 3px 6px;border-bottom:1px solid #ccc;clear:both;">
            <h5>角色&nbsp;&nbsp;&nbsp;&nbsp;<a title="添加角色" ng-click="addRole()"><i class="fa fa-plus"></i></a></h5>
        </div>
        <div ng-repeat="role in roles" style="clear:both;margin-top:5px;">
            <span>{{role.roleName}}<a title="删除" ng-click="delRole(role.roleId)"><i class="fa fa-trash-o"></i></a></span>
        </div>
    </div>
    <!-- 角色编辑-->
    <div ng-show="userRoleEdit">
        <div style="float:right">
            <a class="btn btn-circle btn-icon-only btn-default" title="返回" href="javascript:;"
               ng-click="userRoleCancel();">
                <i class="icon-action-undo"></i>
            </a>
        </div>
        <div class="ztree" style="overflow:auto;max-height:450px" id="roleTree"></div>
    </div>
</div>